<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./ajax.js"></script>
</head>

<body>
    <script>

        // 一个函数作为参数 传给另一个 函数，这个参数函数就叫 回调函数
        // 定义一个函数，传入另一个函数内部，另一个函数 内部 ，会去调用这个函数--
        function box(fn) {
            // fn = function(){}

            // box 内部 调用了fn ，外部定义的函数就会执行
            fn()

        }

        //  把匿名函数作为参数 传递给box 
        box(function () {
            // console.log('222');
        })


        // function ajax(obj) {
        //     // obj.fn
        //     // obj.fn()
        //     //  发起了一个ajax请求-异步--请求成功--再调用 obj.fn()
        // }

        // ajax({ fn: function () { } })

        // 先发起一个注册请求，注册成功以后 再发起 登录请求
        let username = 'zhangsan' + parseInt(Math.random() * 100000)
        let password = '123456'
        let regAPI = 'http://jx.xuzhixiang.top/ap/api/reg.php'
        let loginAPI = 'http://jx.xuzhixiang.top/ap/api/login.php'
        console.log(111);
        // ajax({
        //     url: regAPI,
        //     method: 'get',
        //     params: { username: username, password },
        //     success(r) {
        //         console.log('异步执行-注册成功');
        //         console.log(r);
        //     }
        // })
        // console.log(222);

        // ajax({
        //     url: loginAPI,
        //     method: 'get',
        //     params: { username: username, password },
        //     success(r) {
        //         console.log('异步执行-登录成功');
        //         console.log(r);
        //     }
        // })
        // console.log(3333);

        /*
            异步的请求想要让他们顺序--必须嵌套

             我们上面的代码 相当于 同时发起两个异步成功，谁先成功，谁后成功都不一定
        
             如果多个异步请求-想要有顺序，必须 等一个成功了 再发起第二个

                就会出现 回调函数的嵌套
        */


        ajax({
            url: regAPI,
            method: 'get',
            params: { username: username, password },
            success(r) {
                console.log('异步执行-注册成功');
                console.log(r);


                ajax({
                    url: loginAPI,
                    method: 'get',
                    params: { username: username, password },
                    success(r) {
                        console.log('异步执行-登录成功');
                        console.log(r);



                    }
                })
            }
        })
        console.log(222);


        console.log(3333);

    </script>

</body>

</html>